<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
<h:head>
</h:head>
<h:body>
	<h:form  id="form">

		<p:growl id="msgs" showDetail="true" />

		<p:dataTable id=¨dtCategoria¨  var="categoria" style="width:60%"
			value="#{categoriaManagedBean.listaCategoria}">

			<f:facet name="header">

				<p:graphicImage value="/imagenes/categorias.jpg" />

			</f:facet>

			<p:column headerText="Nombre" style="width:24%">
				<h:outputText value="#{categoria.nombre}" />
			</p:column>

			<p:column headerText="Descripcion" style="width:24%">
				<h:outputText value="#{categoria.descripcion}" />
			</p:column>

			<p:column style="width:4%">
				<p:commandButton update="form:pngActualizar"
					oncomplete="diCategoriaA.show()"
					
					icon="ui-icon-wrench" title="Editar">
					<f:setPropertyActionListener value="#{categoria}"
						target="#{categoriaManagedBean.categoria}" />
				</p:commandButton>
			</p:column>

			<f:facet name="footer">
				<p:commandButton id="viewButton" value="Crear"
					icon="ui-icon-circle-plus" 
					oncomplete="diCategoria.show()" />
				<p:commandButton action="#{from.irConfiguracion}"
					value="Configuracion"
					title="Administrar los productos,categorias y gatos" />
			</f:facet>


		</p:dataTable>


		<p:dialog header="Actualizar Categoria" widgetVar="diCategoriaA"
			resizable="false" width="400" showEffect="clip" hideEffect="fold">

			<h:panelGrid id="pngActualizar" columns="2" cellpadding="4">

				<h:outputText value="Nombre:" />
				<h:inputText required="true"
					requiredMessage="El nombre de la categoria es obligatorio"
					value="#{categoriaManagedBean.categoria.nombre}" />

				<h:outputText value="Descripcion:" />
				<h:inputText required="true"
					requiredMessage="El descripcion de la categoria es obligatorio"
					value="#{categoriaManagedBean.categoria.descripcion}" />

				<f:facet name="footer">
					<p:commandButton value="Actulizar" icon="ui-icon-disk"
						actionListener="#{categoriaManagedBean.actulizar}"
						update="form:dtCategoria"
						oncomplete="diCategoriaA.hide()" />
				</f:facet>

			</h:panelGrid>
		</p:dialog>
	
</h:form>

	
</h:body>
</html>